<template>
  <div class="container">
    <header>
      <!-- 注意插槽上的 name 是一个 Vue 特别保留的 attribute，不会作为 props 传递给插槽 -->
      <slot name="header" :username="username"></slot>
    </header>
    <main>
      <slot></slot>
    </main>
    <footer>
      <slot name="footer"></slot>
    </footer>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: "法外狂徒 张三",
      year: "2023",
    };
  },
};
</script>

<style></style>
